<template>
	<div class="page_box">
		<el-pagination
			:current-page="pageNum"
			:page-sizes="[10, 20]"
			:page-size="pageSize"
			layout="total, sizes, prev, pager, next, jumper"
			:total="pageTotal"
			@size-change="handleSizeChange"
			@current-change="handleCurrentChange"
		/>
	</div>
</template>

<script>
export default {
	// watchCurpage用于页面tab,重置pageNum
	props: ['pageTotal', 'watchCurpage'],
	data() {
		return {
			/* 分页 */
			pageNum: 1,
			pageSize: 10
		};
	},
	watch: {
		watchCurpage(e) {
			this.pageNum = e;
		}
	},
	methods: {
		/* 分页 */
		handleSizeChange(val) {
			console.log(`每页 ${val} 条`);
			this.$emit('pageSize', val);
		},
		handleCurrentChange(val) {
			console.log(`当前页: ${val}`);
			this.$emit('pageNum', val);
		}
	}
};
</script>

<style lang="scss" scoped>
.page_box {
	width: 100%;
	overflow: hidden;
	padding: 100px !important;
	background-color: white !important;
}
</style>
